import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image, ScrollView } from '@tarojs/components'
import './index.scss'
import { parsePrice } from '@utils/utils'

export default class UpToDate extends Taro.Component {
    static defaultProps = {
        list: []
    }

    product(prod) {
        return (
            <View className='prod-item'>
                <View>
                    <View className='imagecont'>
                        <Image src={prod.pic} className='prodimg'></Image>
                    </View>
                    <View className='prod-text'>{prod.prodName}</View>
                    <View className='price'>
                        <Text className='symbol'>￥</Text>
                        <Text className='big-num'>{parsePrice(prod.price)[0]}</Text>
                        <Text className='small-num'>.{parsePrice(prod.price)[1]}</Text>
                    </View>
                </View>
            </View>
        )
    }

    productList(item) {
        const { title, prods } = item
        const prod = (prods || []).map(item => {
            return this.product(item)
        })
        return (
            <View className='title'>
                <Text>{title}</Text>
                <View className='more-prod-cont'>
                    <Text className='more'>查看更多</Text>
                </View>
                <View className='item-cont'>
                    {
                        prod
                    }
                </View>
            </View>
        )
    }

    render() {
        const { list } = this.props
        return (
            // 每日上新
            <View className='up-to-date'>
                {
                    this.productList(list)
                }
            </View>
        )
    }
}